<template>
  <div style="margin-top: 1.5%">
    <div class="sidebar">
      <!-- 跳转到指定模块 -->
      <el-card class="btn-box">
        <el-button
          style="margin-left: 10px"
          @click="goAssignBlock('block'+ 0,20)"
        >输血不良反应
        </el-button>
        <el-button
          @click="goAssignBlock('block'+ 1,20)"
        >事件情况描述
        </el-button>
        <el-button
          @click="goAssignBlock('block'+ 2,20)"
        >患者资料
        </el-button>
        <el-button
          @click="goAssignBlock('block'+ 3,20)"
        >事件基本信息
        </el-button>
        <el-button
          @click="goAssignBlock('block'+ 4,20)"
        >当事人资料
        </el-button>
        <el-button
          @click="goAssignBlock('block'+ 5,20)"
        >事件结果
        </el-button>
        <el-button
          @click="goAssignBlock('block'+ 6,20)"
        >报告者信息
        </el-button>
      </el-card>
    </div>

    <div class="content">
      <el-collapse style=" margin-left: 8%;" v-model="activeNames">

        <!--输血不良反应-->
        <!--      <div style="width: 100%; margin-left: 8%">-->
        <div class="bname" ref="block0"></div>
        <el-collapse-item name="1">
          <template #title>
            <div class="shijianbname">输血不良反应</div>
          </template>
          <div class="block" style="margin-top: 0.5%;">
            <el-form ref="basicForm" :rules="rules" :model="basicForm" label-width="140px">
              <el-form-item label="输血不良反应类型" prop="transfusionBloodReactionType">
                <el-radio-group v-model="basicForm.transfusionBloodReactionType">
                  <el-radio label="01">发热反应</el-radio>
                  <el-radio label="02">过敏反应</el-radio>
                  <el-radio label="03">溶血反应</el-radio>
                  <el-radio label="04">细菌污染反应</el-radio>
                  <el-radio label="05">其他反应</el-radio>
                </el-radio-group>
              </el-form-item>
              <el-form-item label="主要症状" prop="transfusionBloodMainSymptoms">
                <el-checkbox-group v-model="box1" @change="zhengzhuang(box1)">
                  <el-checkbox label="01">皮疹</el-checkbox>
                  <el-checkbox label="02">皮肤瘙痒</el-checkbox>
                  <el-checkbox label="03">眼脸肿胀</el-checkbox>
                  <el-checkbox label="04">发热</el-checkbox>
                  <el-checkbox label="05">寒颤</el-checkbox>
                  <el-checkbox label="06">血压下降或上升</el-checkbox>
                  <el-checkbox label="07">心跳加速</el-checkbox>
                  <el-checkbox label="08">呼吸困难</el-checkbox>
                  <el-checkbox label="09">烦躁不安</el-checkbox>
                  <el-checkbox label="10">颜面潮红</el-checkbox>
                  <el-checkbox label="11">疼痛（腰背等）</el-checkbox>
                  <el-checkbox label="12">血尿</el-checkbox>
                  <el-checkbox label="13">其他</el-checkbox>
                </el-checkbox-group>
              </el-form-item>
              <el-form-item label="输血日期（起）" style="margin-top: 20px">
                <el-date-picker
                  v-model="basicForm.transfusionBloodStartTime"
                  type="datetime"
                  placeholder="选择日期时间"
                  style="width: 300px">
                </el-date-picker>
              </el-form-item>
              <el-form-item label="输血日期（止）">
                <el-date-picker
                  v-model="basicForm.transfusionBloodEndTime"
                  type="datetime"
                  placeholder="选择日期时间"
                  style="width: 300px">
                </el-date-picker>
              </el-form-item>
              <el-form-item label="患者血型" prop="transfusionPatientType">
                <el-checkbox-group v-model="box2" @change="huanzhe1(box2)">
                  <el-checkbox label="01">ABO血型</el-checkbox>
                  <el-checkbox label="02">Rh血型</el-checkbox>
                </el-checkbox-group>
              </el-form-item>
              <div v-if="this.box2.includes('01')" >
                <el-form-item label="ABO型" prop="transfusionAboType">
                  <el-radio-group v-model="basicForm.transfusionAboType">
                    <el-radio label="01">A型</el-radio>
                    <el-radio label="02">B型</el-radio>
                    <el-radio label="03">O型</el-radio>
                  </el-radio-group>
                </el-form-item>
              </div>
              <div v-if="this.box2.includes('02')" >
                <el-form-item label="Rh型" prop="transfusionRhType">
                  <el-radio-group v-model="basicForm.transfusionRhType">
                    <el-radio label="01">Rh（+）型</el-radio>
                    <el-radio label="02">Rh（-）型</el-radio>
                  </el-radio-group>
                </el-form-item>
              </div>
              <el-form-item label="输血史">
                <el-radio-group v-model="basicForm.transfusionBloodHistory">
                  <el-radio label="01">有</el-radio>
                  <el-radio label="02">无</el-radio>
                  <el-radio label="03">不详</el-radio>
                </el-radio-group>
              </el-form-item>
              <el-form-item label="妊娠史">
                <el-radio-group v-model="basicForm.transfusionPregnancyHistory">
                  <el-radio label="01">有</el-radio>
                  <el-radio label="02">无</el-radio>
                  <el-radio label="03">不详</el-radio>
                </el-radio-group>
              </el-form-item>
              <el-form-item label="不良反应次数" prop="situationCausesconsequences" :rules="[{pattern:/^[0-9]+$/, message: '不良反应次数必须为数字'}]">
                <el-input v-model="basicForm.situationCausesconsequences" placeholder="请输入内容"
                          style="width: 300px" maxlength="10" ></el-input>
                次
              </el-form-item>
              <el-form-item>
                <template slot="label">
                  <span style="color:blue;margin-top: 1%;font-size: 14px">主要供血者信息：</span>
                </template>
              </el-form-item>
              <el-form-item label="献血编号" prop="transfusionMainNumber" :rules="[{pattern:/^[0-9]+$/, message: '鲜血编号必须为数字'}]" >
                <el-input v-model="basicForm.transfusionMainNumber" placeholder="请输入内容" style="width: 300px"
                           maxlength="20"></el-input>
              </el-form-item>
              <el-form-item label="血液成分（品名）" style="margin-top: 20px" prop="transfusionMainName">
                <el-select v-model="basicForm.transfusionMainName" placeholder="请选择" style="width: 300px">
                  <el-option
                    v-for="item in optionsBloodMain"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value">
                  </el-option>
                </el-select>
              </el-form-item>
              <el-form-item label="患者血型" prop="transfusionMainType">
                <el-checkbox-group v-model="box3" @change="huanzhe2(box3)">
                  <el-checkbox label="01">ABO血型</el-checkbox>
                  <el-checkbox label="02">Rh血型</el-checkbox>
                </el-checkbox-group>
              </el-form-item>
              <div v-if="this.box3.includes('01')" >
                <el-form-item label="ABO型" prop="transfusionMainAboType">
                  <el-radio-group v-model="basicForm.transfusionMainAboType">
                    <el-radio label="01">A型</el-radio>
                    <el-radio label="02">B型</el-radio>
                    <el-radio label="03">O型</el-radio>
                  </el-radio-group>
                </el-form-item>
              </div>
              <div v-if="this.box3.includes('02')" >
                <el-form-item label="Rh型" prop="transfusionMainRhType">
                  <el-radio-group v-model="basicForm.transfusionMainRhType">
                    <el-radio label="01">Rh（+）型</el-radio>
                    <el-radio label="02">Rh（-）型</el-radio>
                  </el-radio-group>
                </el-form-item>
              </div>
              <el-form-item label="血量" style="margin-top: 20px" prop="transfusionMainVolume" :rules="[{pattern:/^[0-9]+$/, message: '血量必须为数字'}]">
                <el-input v-model="basicForm.transfusionMainVolume" placeholder="请输入内容" style="width: 300px"
                          maxlength="10" ></el-input>
                U/ml
              </el-form-item>
              <el-form-item>
                <template slot="label">
                  <span style="color:blue;margin-top: 1%;font-size: 14px">其他供血者信息：</span>
                </template>
              </el-form-item>
              <el-form-item label="献血编号" prop="transfusionOtherNumber" :rules="[{pattern:/^[0-9]+$/, message: '献血编号必须为数字'}]">
                <el-input v-model="basicForm.transfusionOtherNumber" placeholder="请输入内容"
                          style="width: 300px" maxlength="20" ></el-input>
              </el-form-item>
              <el-form-item label="血液成分（品名）" prop="transfusionOtherName">
                <el-select v-model="basicForm.transfusionOtherName" placeholder="请选择" style="width: 300px">
                  <el-option
                    v-for="item in optionsBloodOther"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value">
                  </el-option>
                </el-select>
              </el-form-item>
              <el-form-item label="患者血型" prop="transfusionOtherType">
                <el-checkbox-group v-model="box4" @change="huanzhe3(box4)">
                  <el-checkbox label="01">ABO血型</el-checkbox>
                  <el-checkbox label="02">Rh血型</el-checkbox>
                </el-checkbox-group>
              </el-form-item>
              <div v-if="this.box4.includes('01')" >
                <el-form-item label="ABO型" prop="transfusionOtherAboType">
                  <el-radio-group v-model="basicForm.transfusionOtherAboType">
                    <el-radio label="01">A型</el-radio>
                    <el-radio label="02">B型</el-radio>
                    <el-radio label="03">O型</el-radio>
                  </el-radio-group>
                </el-form-item>
              </div>
              <div v-if="this.box4.includes('02')" >
                <el-form-item label="Rh型" prop="transfusionOtherRhType">
                  <el-radio-group v-model="basicForm.transfusionOtherRhType">
                    <el-radio label="01">Rh（+）型</el-radio>
                    <el-radio label="02">Rh（-）型</el-radio>
                  </el-radio-group>
                </el-form-item>
              </div>
              <el-form-item label="血量" style="margin-top: 20px" prop="transfusionOtherVolume" :rules="[{pattern:/^[0-9]+$/, message: '血量必须为数字'}]">
                <el-input v-model="basicForm.transfusionOtherVolume" placeholder="请输入内容"
                          style="width: 300px"  maxlength="20"></el-input>
                U/ml
              </el-form-item>
            </el-form>
          </div>
        </el-collapse-item>
        <!--      </div>-->

        <!--事件情况描述-->
        <!--        <div style="width: 100%; margin-top:1%; margin-left: 8%">-->
        <div class="bname" ref="block1" style="border-top: 1px solid rgba(165,169,175,0.29);padding-top:0.5%"></div>
        <el-collapse-item name="2">
          <template #title>
            <div class="shijianbname">事件情况描述</div>
          </template>
          <div class="block" style="margin-top: 0.5%;">
            <el-form ref="reportForm1" :model="reportForm" :rules="rules" label-width="140px">
              <el-form-item label="事件描述或事件经过" prop="situationEdescriptionProcess">
                <el-input type="textarea" v-model="reportForm.situationEdescriptionProcess" placeholder="请输入内容"
                          style="width: 300px" maxlength="1000"
                          :rows="3" resize="none"></el-input>
              </el-form-item>
              <el-form-item label="事件发生时是否采取处理措施" prop="situationMeasuresEvent">
                <el-radio-group v-model="reportForm.situationMeasuresEvent">
                  <el-radio label="01">是</el-radio>
                  <el-radio label="02">否</el-radio>
                </el-radio-group>
              </el-form-item>
              <el-form-item label="采取的处理措施" style="margin-top: 20px">
                <el-input type="textarea" v-model="reportForm.situationTakenMeasures" placeholder="请输入内容"
                          style="width: 300px" maxlength="1000"
                          :rows="3" resize="none"></el-input>
              </el-form-item>
              <div v-if="reportForm.situationMeasuresEvent==='01'">
                <el-form-item label="事件所引起的后果">
                  <el-input v-model="reportForm.situationCausesconsequences" placeholder="请输入内容"
                            style="width: 300px" maxlength="100"></el-input>
                </el-form-item>
              </div>
            </el-form>
          </div>
        </el-collapse-item>
        <!--        </div>-->

        <!--患者资料-->
        <!--        <div style="width: 100%; margin-left: 8%; margin-top:1%">-->
        <div class="bname" ref="block2" style="border-top: 1px solid rgba(165,169,175,0.29);padding-top:0.5%"></div>
        <el-collapse-item name="3">
          <template #title>
            <div class="shijianbname">患者资料</div>
          </template>
          <div class="block" style="margin-top: 0.5%;">
            <el-form ref="reportForm2" :model="reportForm" :rules="rules" label-width="140px">
              <div style="margin-left: 1%">
                <el-form-item label="是否涉及患者" prop="patientInvolved">
                  <el-radio-group v-model="reportForm.patientInvolved" style="width: 200px">
                    <el-radio label="01">是</el-radio>
                    <el-radio label="02">否</el-radio>
                  </el-radio-group>
                </el-form-item>
                <div class="painter" v-if="reportForm.patientInvolved==='01'">
                  <el-form-item label="诊断类别" prop="patientDiagnosisCategory">
                    <el-radio-group v-model="reportForm.patientDiagnosisCategory">
                      <el-radio label="01">急诊</el-radio>
                      <el-radio label="02">门诊</el-radio>
                      <el-radio label="03">住院</el-radio>
                    </el-radio-group>
                  </el-form-item>
                  <el-form-item label="病历号/门诊号" prop="patientRecordOutpatient" style="margin-top: 20px" >
                    <el-input v-model="reportForm.patientRecordOutpatient" placeholder="请输入内容"
                              style="width:300px" resize="none" maxlength="50"
                              ></el-input>
                  </el-form-item>
                  <el-form-item label="姓名" prop="patientName" style="margin-top: 20px">
                    <el-input type="text" v-model="reportForm.patientName" placeholder="请输入内容" style="width: 300px"
                              resize="none" maxlength="10"></el-input>
                  </el-form-item>
                  <el-form-item label="性别" peop="patientGender">
                    <el-radio-group v-model="reportForm.patientGender">
                      <el-radio label="01">男</el-radio>
                      <el-radio label="02">女</el-radio>
                    </el-radio-group>
                  </el-form-item>
                  <el-form-item label="出生日期">
                    <el-date-picker
                      v-model="reportForm.patientDateOfBirth"
                      type="date"
                      placeholder="选择日期 "
                      style="width: 300px">
                    </el-date-picker>
                  </el-form-item>
                  <!--                    <el-form-item label="年龄">-->
                  <!--                      <el-input v-model="form.patientAge" placeholder="请输入内容" style="width: 220px"></el-input>-->
                  <!--                      <el-radio-group style="margin-left: 1%" v-model="form.patientAge">-->
                  <!--                        <el-radio label="年"></el-radio>-->
                  <!--                        <el-radio label="月"></el-radio>-->
                  <!--                        <el-radio label="天"></el-radio>-->
                  <!--                        <el-radio label="小时"></el-radio>-->
                  <!--                      </el-radio-group>-->
                  <!--                    </el-form-item>-->

                  <el-form-item label="年龄阶段">
                    <el-select v-model="reportForm.patientAgeStage" placeholder="请选择" style="width: 300px">
                      <el-option
                        v-for="item in dict.type.he_patient_age_grades"
                        :key="item.value"
                        :label="item.label"
                        :value="item.value">
                      </el-option>
                    </el-select>
                  </el-form-item>
                  <el-form-item label="家属联系电话" prop="patientFamilyNumber" :rules="[{pattern:/^[0-9]+$/, message: '家属联系电话必须为数字'}]">
                    <el-input v-model="reportForm.patientFamilyNumber" placeholder="请输入内容" style="width: 300px"
                              maxlength="20" ></el-input>
                  </el-form-item>
                  <el-form-item label="入院就诊时间">
                    <el-date-picker
                      v-model="reportForm.patientAdmissionTime"
                      type="datetime"
                      placeholder="选择日期时间" style="width: 300px">
                    </el-date-picker>
                  </el-form-item>
                  <!--                  <el-form-item label="科室" prop="patientDepartment" >-->
                  <!--                    <el-select v-model="reportForm.patientDepartment" placeholder="请选择" style="width: 300px">-->
                  <!--                      <el-option-->
                  <!--                        v-for="item in dict.type.he_department_name"-->
                  <!--                        :key="item.value"-->
                  <!--                        :label="item.label"-->
                  <!--                        :value="item.value">-->
                  <!--                      </el-option>-->
                  <!--                    </el-select>-->
                  <!--                  </el-form-item>-->
                  <el-form-item label="床号" style="margin-top: 20px">
                    <el-input v-model="reportForm.patientBedNumber" placeholder="请输入内容" style="width: 300px"
                              maxlength="20"></el-input>
                  </el-form-item>
                  <el-form-item label="护理级别">
                    <el-radio-group v-model="reportForm.patientNursingLevel">
                      <el-radio label="01">特级护理</el-radio>
                      <el-radio label="02">Ⅰ级护理</el-radio>
                      <el-radio label="03">Ⅱ级护理</el-radio>
                      <el-radio label="04">Ⅲ级护理</el-radio>
                    </el-radio-group>
                  </el-form-item>
                  <el-form-item label="文化程度">
                    <el-radio-group v-model="reportForm.patientEducationLevel" style="width: 110%">
                      <el-radio label="01">研究生</el-radio>
                      <el-radio label="02">大学本科</el-radio>
                      <el-radio label="03">大学专科</el-radio>
                      <el-radio label="04">中专（中技）</el-radio>
                      <el-radio label="05">高中</el-radio>
                      <el-radio label="06">初中</el-radio>
                      <el-radio label="07">小学</el-radio>
                      <el-radio label="08">文盲</el-radio>
                    </el-radio-group>
                  </el-form-item>
                  <el-form-item label="诊断（多个诊断之间用逗号隔开）">
                    <el-input type="textarea" v-model="reportForm.patientDiagnosis" placeholder="请输入内容"
                              style="width: 300px"
                              :rows="6" resize="none" maxlength="200"></el-input>
                  </el-form-item>
                </div>
              </div>
            </el-form>
          </div>
        </el-collapse-item>
        <!--        </div>-->
        <!--事件基本信息-->
        <!--        <div style="width: 100%; margin-left: 8%; margin-top:1%">-->

        <div class="bname" ref="block3" style="border-top: 1px solid rgba(165,169,175,0.29);padding-top:0.5%"></div>
        <el-collapse-item name="4">
          <template #title>
            <div class="shijianbname">事件基本信息</div>
          </template>

          <div class="block" style="margin-top: 0.5%;">
            <el-form ref="reportForm3" :model="reportForm" :rules="rules" label-width="140px">
              <el-form-item prop="occurrenceTime" label="发生时间">
                <el-date-picker
                  v-model="reportForm.occurrenceTime"
                  type="datetime"
                  placeholder="选择日期时间"
                  style="width: 300px">
                </el-date-picker>
              </el-form-item>
              <el-form-item label="发生日期" prop="occurrenceDate" style="margin-top: 20px">
                <el-date-picker
                  v-model="reportForm.occurrenceDate"
                  type="date"
                  placeholder="选择日期"
                  style="width: 300px">
                </el-date-picker>
              </el-form-item>
              <el-form-item label="日期类型">
                <el-radio-group v-model="reportForm.occurrenceDateType">
                  <el-radio label="工作日"></el-radio>
                  <el-radio label="周末"></el-radio>
                </el-radio-group>
              </el-form-item>
              <el-form-item label="发生时段">
                <el-radio-group v-model="reportForm.occurrenceTimePeriod">
                  <el-radio label="01">上午(08：00-12：00)</el-radio>
                  <el-radio label="02">中午(12：00-14：00)</el-radio>
                  <el-radio label="03">下午(14：00-18：00)</el-radio>
                  <el-radio label="04">上夜(18：00-00：00)</el-radio>
                  <el-radio label="05">下夜(00：00-08：00)</el-radio>
                </el-radio-group>
              </el-form-item>
              <el-form-item label="发生地点">
                <el-input type="text" v-model="reportForm.occurrenceLocation" placeholder="请输入内容" style="width:300px"
                          resize="none" maxlength="200"></el-input>
              </el-form-item>
              <el-form-item label="现场照片" prop="images">
                <image-upload :limit="1" v-model="reportForm.occurrenceScenePhotos"/>
              </el-form-item>
              <!--                <el-form-item label="现场照片">-->
              <!--                  <el-upload-->
              <!--                    action="https://jsonplaceholder.typicode.com/posts/"-->
              <!--                    list-type="picture-card"-->
              <!--                    :on-preview="handlePictureCardPreview1"-->
              <!--                    :on-remove="handleRemove"-->
              <!--                    v-model="form.occurrenceScenePhotos">-->
              <!--                    <i class="el-icon-plus"></i>-->
              <!--                  </el-upload>-->
              <!--                  <el-dialog :visible.sync="dialogVisible1">-->
              <!--                    <img width="100%" :src="dialogImageUrl1" alt="">-->
              <!--                  </el-dialog>-->
              <!--                </el-form-item>-->
            </el-form>
          </div>
        </el-collapse-item>
        <!--        </div>-->

        <!--当事人基本资料-->
        <!--        <div style="width: 100%; margin-left: 8%; margin-top:1%">-->

        <div class="bname" ref="block4" style="border-top: 1px solid rgba(165,169,175,0.29);padding-top:0.5%"></div>
        <el-collapse-item name="5">
          <template #title>
            <div class="shijianbname">当事人基本资料</div>
          </template>

          <div class="block" style="margin-top: 0.5%;">
            <el-form ref="reportForm4" :rules="rules" :model="reportForm" label-width="140px">
              <el-form-item label="姓名" prop="partyName">
                <el-input type="text" v-model="reportForm.partyName" placeholder="请输入内容" style="width: 300px"
                          resize="none" maxlength="10"></el-input>
              </el-form-item>
              <el-form-item label="年龄" style="margin-top: 20px" prop="partyAge" :rules="[{pattern:/^[0-9]+$/, message: '年龄必须为数字'}]">
                <el-input type="text" v-model="reportForm.partyAge" placeholder="请输入内容" style="width: 300px"
                          resize="none" maxlength="10" ></el-input>
              </el-form-item>
              <el-form-item label="工作年限">
                <el-radio-group v-model="reportForm.partyYearsOfExperience">
                  <el-radio label="01"><1年</el-radio>
                  <el-radio label="02">1≤y≤2</el-radio>
                  <el-radio label="03">2≤y≤5</el-radio>
                  <el-radio label="04">5≤y≤10</el-radio>
                  <el-radio label="05">10≤y≤20</el-radio>
                  <el-radio label="06">≥20年</el-radio>
                </el-radio-group>
              </el-form-item>
              <el-form-item label="类别">
                <el-radio-group v-model="reportForm.partyCategory">
                  <el-radio label="01">在编</el-radio>
                  <el-radio label="02">聘用</el-radio>
                  <el-radio label="03">进修</el-radio>
                  <el-radio label="04">实习</el-radio>
                  <el-radio label="05">轮转</el-radio>
                </el-radio-group>
              </el-form-item>
              <el-form-item label="学历">
                <el-radio-group v-model="reportForm.partyEducation">
                  <el-radio label="01">中专</el-radio>
                  <el-radio label="02">大专</el-radio>
                  <el-radio label="03">本科</el-radio>
                  <el-radio label="04">硕士</el-radio>
                  <el-radio label="05">其他</el-radio>
                </el-radio-group>
              </el-form-item>
              <el-form-item label="职务">
                <el-radio-group v-model="reportForm.partyPosition">
                  <el-radio label="01">医疗</el-radio>
                  <el-radio label="02">药剂</el-radio>
                  <el-radio label="03">护理</el-radio>
                  <el-radio label="04">医技</el-radio>
                  <el-radio label="05">检验</el-radio>
                  <el-radio label="06">工程技术</el-radio>
                  <el-radio label="07">行政管理</el-radio>
                  <el-radio label="08">后勤保障</el-radio>
                </el-radio-group>
              </el-form-item>
            </el-form>
          </div>
        </el-collapse-item>
        <!--        </div>-->

        <!--事件结果-->
        <!--        <div style="width: 100%; margin-left: 8%; margin-top:1%">-->
        <div class="bname" ref="block5" style="border-top: 1px solid rgba(165,169,175,0.29);padding-top:0.5%"/>
        <el-collapse-item name="6">
          <template #title>
            <div class="shijianbname">事件结果</div>
          </template>


          <div class="block" style="margin-top: 0.5%;">
            <el-form ref="reportForm5" :model="reportForm" :rules="rules" label-width="140px">
              <el-form-item label="纠纷或者纠纷隐患的可能性" prop="resultsPossibilityDispute">
                <el-radio-group v-model="reportForm.resultsPossibilityDispute">
                  <el-radio label="01">确定有</el-radio>
                  <el-radio label="02">可能有</el-radio>
                  <el-radio label="03">无</el-radio>
                </el-radio-group>
              </el-form-item>
              <el-form-item label="事件严重程度" prop="resultsEventSeverity" style="margin-top: 20px">
                <el-select v-model="reportForm.resultsEventSeverity" placeholder="请选择">
                  <el-option
                    v-for="item in dict.type.he_event_severity"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value">
                  </el-option>
                </el-select>
              </el-form-item>
              <el-form-item label="事件分级" prop="resultsEventClassification" style="width: 600px">
                <el-radio-group v-model="reportForm.resultsEventClassification">
                  <el-radio label="01" style="margin-top: 10px; margin-bottom: 10px">Ⅰ级事件: 发生错误，造成患者死亡 (包括损害程度I级)
                  </el-radio>
                  <el-radio label="02" style="margin-bottom: 10px">Ⅱ级事件: 发生错误，且造成患者伤害 (包括损害程度E、F、G、H级)</el-radio>
                  <el-radio label="03" style="margin-bottom: 10px">Ⅲ级事件: 发生错误，但未造成患者伤害 (包括损害程度B、C、D级)</el-radio>
                  <el-radio label="04">Ⅳ级事件: 错误未发生 (错误隐患)(包括损害程度A级)</el-radio>
                </el-radio-group>
              </el-form-item>
              <el-form-item label="伤害严重度" prop="resultsSeverityInjury">
                <el-radio-group v-model="reportForm.resultsSeverityInjury">
                  <el-radio label="01">死亡</el-radio>
                  <el-radio label="02">极度严重</el-radio>
                  <el-radio label="03">重度</el-radio>
                  <el-radio label="04">中度</el-radio>
                  <el-radio label="05">轻度</el-radio>
                  <el-radio label="06">未造成伤害</el-radio>
                  <el-radio label="07">无伤害</el-radio>
                </el-radio-group>
              </el-form-item>
            </el-form>
          </div>
        </el-collapse-item>
        <!--        </div>-->

        <!--报告者信息-->
        <!--        <div style="width: 100%; margin-left: 8%; margin-top:1%">-->

        <div class="bname" ref="block6" style="border-top: 1px solid rgba(165,169,175,0.29);padding-top:0.5%"></div>
        <el-collapse-item name="7">
          <template #title>
            <div class="shijianbname">报告者信息</div>
          </template>

          <div class="block" style="margin-top: 0.5%;">
            <el-form ref="reportForm6" :model="reportForm" :rules="rules" label-width="140px">
              <el-form-item label="事件呈报方式" prop="reportMethod">
                <el-radio-group v-model="reportForm.reportMethod">
                  <el-radio label="01">主动呈报</el-radio>
                  <el-radio label="02">投诉</el-radio>
                  <el-radio label="03">他人报告</el-radio>
                  <el-radio label="04">质量检查发现</el-radio>
                </el-radio-group>
              </el-form-item>
              <el-form-item label="其他信息备注" style="margin-top: 20px">
                <el-input type="textarea" v-model="reportForm.reportOtherRemarks" placeholder="请输入内容"
                          style="width: 300px"
                          :rows="6" resize="none" maxlength="200"></el-input>
              </el-form-item>
              <el-form-item label="附件图片" prop="images">
                <image-upload :limit="1" v-model="reportForm.reportAttachedImages"/>
              </el-form-item>
              <!--                <el-form-item label="附件图片">-->
              <!--                  <el-upload-->
              <!--                    action="https://jsonplaceholder.typicode.com/posts/"-->
              <!--                    list-type="picture-card"-->
              <!--                    :on-preview="handlePictureCardPreview2"-->
              <!--                    :on-remove="handleRemove"-->
              <!--                    v-model="form.reportAttachedImages">-->
              <!--                    <i class="el-icon-plus"></i>-->
              <!--                  </el-upload>-->
              <!--                  <el-dialog :visible.sync="dialogVisible2">-->
              <!--                    <img width="100%" :src="dialogImageUrl2" alt="">-->
              <!--                  </el-dialog>-->
              <!--                </el-form-item>-->
            </el-form>
          </div>
        </el-collapse-item>
        <!--        </div>-->
      </el-collapse>
    </div>

    <!--保存按钮-->
    <div style="position: fixed; margin-top: -0.5%; right: 3%; width: 300px">
      <el-button
        type="primary"
        style="margin-left: 15px"
        @click="baocun"
      >保存
      </el-button>
      <el-button
        type="info" plain
        style="margin-left: 15px"
        @click="fanhui"
      >返回
      </el-button>
    </div>

  </div>
</template>

<script>
import ScrollPane from "@/layout/components/TagsView/ScrollPane";
import {addBasic, getBasic,updateBasic} from "@/api/module/gjj/basic";

export default {
  components: {ScrollPane},
  dicts: ['he_blood_transfusion_safety_type', 'he_department_name', 'he_use_of_medications', 'he_event_severity', 'he_discussion_qualitative_levels', 'he_measure_strengthen_communication', 'he_measure_improve_administration', 'he_measure_care_management', 'he_measure_strengthen_education', 'he_possible_causes_environment', 'he_possible_causes_process_system', 'he_possible_causes_consumable_drug', 'he_possible_causes_equipment', 'he_discussion_medical_malpractice', 'he_discussion_involves_patient', 'he_education', 'he_patient_gender', 'he_party_post', 'he_report_event_state', 'he_report_event_type', 'he_patient_age_grades', 'he_event_severity', 'he_review_status', 'he_report_status', 'he_position', 'he_event_classification', 'he_review_event_type', 'he_possibility_of_dispute', 'he_patient_involved', 'he_analyze_reports', 'he_fallback_status', 'he_occurrence_time_period', 'he_event_determinatione', 'he_situation_measures_event', 'he_patient_education_level', 'he_diagnosis_category', 'he_years_of_experience', 'he_severity_of_injury', 'he_reporting_method', 'he_patient_nursing_level', 'he_date_type', 'he_invalidation_status', 'he_patient_ethnic_group', 'he_category', 'he_handling_status', 'he_possible_causes_workers', 'he_possible_causes_patient', 'he_possible_causes_family'],

  data() {
    return {
      activeNames: ['1', '2', '3', '4', '5', '6', '7'],
      box1: [],
      box2: [],
      box3: [],
      box4: [],
      // 遮罩层
      loading: true,
      // 选中数组
      ids: [],
      // 非单个禁用
      single: true,
      // 非多个禁用
      multiple: true,
      // 显示搜索条件
      showSearch: true,
      // 总条数
      total: 0,
      // 事件上报信息表格数据
      reportList: [],
      // 弹出层标题
      title: "",
      // 是否显示弹出层
      open: false,
      // 查询参数
      formEvent: {
        //代表是事件基本信息表
        heEventBasic: {},
        //代表事件上传信息表
        heEventReport: {},
        //代表事件流程表
        heEventFlow: {},
      },
      //代表事件基本信息表
      basicForm: {
        //这个就是新增到事件基本信息表的事件
        transfusionBloodMainSymptoms: '',
        transfusionPatientType: '',
        transfusionMainType: '',
        transfusionOtherType: '',
        transfusionBloodReactionType: null,
        transfusionBloodStartTime: null,
        transfusionBloodEndTime: null,
        transfusionAboType: null,
        transfusionRhType: null,
        transfusionBloodHistory: null,
        transfusionPregnancyHistory: null,
        transfusionAdverseReactionCount: null,
        transfusionMainNumber: null,
        transfusionMainName: null,
        transfusionMainAboType: null,
        transfusionMainRhType: null,
        transfusionMainVolume: null,
        transfusionOtherNumber: null,
        transfusionOtherName: null,
        transfusionOtherAboType: null,
        transfusionOtherRhType: null,
        transfusionOtherVolume: null,
        examineType: null,
        examineSpecimenInvasive: null,
        examineSpecimenErrorType: null,
        examineSpecimenType: null,
        pathologySpecimenType: null,
        pathologyErrorType: null,
        logisticalRelatedEvent: null,
        securityInjuryEvent: null,
        publicAccidentEvent: null,
        informationRelatedEvent: null,
        windowServiceEvent: null,
        costRelatedEvent: null,
      },
      //代表事件上报信息表
      reportForm: {
        reportEventType: '28',
        reviewEventType: '01',
        //以下都是新增到事件上传信息表的字段
        //事件情况描述
        situationEdescriptionProcess: '',
        situationMeasuresEvent: '',
        situationTakenMeasures: '',
        situationCausesconsequences: '',
        //患者资料
        patientInvolved: '',
        patientDiagnosisCategory: '',
        patientRecordOutpatient: '',
        patientName: '',
        patientGender: '',
        patientDateOfBirth: '',
        patientAge: '',
        patientAgeStage: '',
        patientEthnicGroup: '',
        patientWeight: '',
        patientPreDisease: '',
        patientContact: '',
        patientFamilyNumber: '',
        patientAdmissionTime: '',
        patientDepartment: '',
        patientBedNumber: '',
        patientNursingLevel: '',
        patientEducationLevel: '',
        patientDiagnosis: '',
        //其他情况暂时没有字段以后加这里先写死
        //事件基本信息
        occurrenceTime: '',
        occurrenceDate: '',
        occurrenceDateType: '',
        occurrenceTimePeriod: '',
        occurrenceLocation: '',
        occurrenceScenePhotos: '',
        //当事人资料
        partyName: '',
        partyAge: '',
        partyYearsOfExperience: '',
        partyCategory: '',
        partyEducation: '',
        partyPosition: '',
        partyPost: '',
        //事件结果
        resultsPossibilityDispute: '',
        resultsEventSeverity: '',
        resultsEventClassification: '',
        resultsSeverityInjury: '',
        //报告者信息(上报信息)
        reportMethod: '',
        reportAttachedImages: '',
        reportOtherRemarks: '',
        reportDepartment: '',
        note1: '',
      },
      //代表事件流程表
      flowForm: {},
      // 表单校验
      rules: {
        transfusionAboType: [{
          required: true, message: "请选择血型", trigger: "change"
        }],
        transfusionRhType: [{
          required: true, message: "请选择血型", trigger: "change"
        }],
        transfusionMainAboType: [{
          required: true, message: "请选择血型", trigger: "change"
        }],
        transfusionMainRhType: [{
          required: true, message: "请选择血型", trigger: "change"
        }],
        transfusionOtherAboType: [{
          required: true, message: "请选择血型", trigger: "change"
        }],
        transfusionOtherRhType: [{
          required: true, message: "请选择血型", trigger: "change"
        }],
        transfusionMainName: [{
          required: true, message: "血液成分未选择", trigger: "change"
        }],
        transfusionOtherName: [{
          required: true, message: "血液成分未选择", trigger: "change"
        }],
        transfusionBloodMainSymptoms: [{
          required: true, message: "主要症状至少选择一项", trigger: "blur"
        }],
        transfusionBloodReactionType: [{
          required: true, message: "反应类型不能为空", trigger: "change"
        }],
        transfusionPatientType: [{
          required: true, message: "患者血型不能为空", trigger: "blur"
        }],
        transfusionMainType: [{
          required: true, message: "患者血型不能为空", trigger: "blur"
        }],
        transfusionOtherType: [{
          required: true, message: "患者血型不能为空", trigger: "blur"
        }],
        situationEdescriptionProcess:[{
          required: true, message: "事件描述不能为空", trigger: "blur"
        }],

        resultsEventClassification: [{
          required: true, message: "事件分级不能为空", trigger: "change"
        }],
        resultsEventSeverity: [{
          required: true, message: "严重程度不能为空", trigger: "change"
        }],
        patientName: [{
          required: true, message: "姓名不能为空", trigger: "blur"
        }],
        situationMeasuresEvent: [{
          required: true, message: "请选择是否采取了措施", trigger: "change"
        }],
        resultsSeverityInjury: [{
          required: true, message: "严重程度不能为空", trigger: "change"
        }],
        patientInvolved: [{
          required: true, message: "请选择是否涉及患者", trigger: "change"
        }],
        partyName: [{
          required: true, message: "姓名不能为空", trigger: "blur"
        }],

        occurrenceTime: [{
          required: true, message: "发生时段不能为空", trigger: "blur"
        }],
        occurrenceDate: [{
          required: true, message: "发生日期不能为空", trigger: "blur"
        }],
        reportMethod: [{
          required: true, message: "呈报方式不能为空", trigger: "change"
        }],
        resultsPossibilityDispute: [{
          required: true, message: "可能性不能为空", trigger: "change"
        }],
        patientDiagnosisCategory: [{
          required: true, message: "诊断类别不能为空", trigger: "change"
        }],
        patientRecordOutpatient: [{
          required: true, message: "门诊/病例号不能为空", trigger: "blur"
        },{pattern:/^[0-9]+$/, message: '病历号/门诊号必须为数字'}]
      },
      optionsBloodMain: [
        {
          value: '全血',
          label: '全血'
        },
        {
          value: '其他制剂',
          label: '其他制剂'
        },
        {
          value: '冷冻红细胞',
          label: '冷冻红细胞'
        },
        {
          value: '冷沉淀',
          label: '冷沉淀'
        },
        {
          value: '少白细胞红细胞',
          label: '少白细胞红细胞'
        },
        {
          value: '手工分离浓缩血小板',
          label: '手工分离浓缩血小板'
        },
        {
          value: '新鲜冰冻血浆',
          label: '新鲜冰冻血浆'
        },
        {
          value: '新鲜液体血浆',
          label: '新鲜液体血浆'
        },
        {
          value: '普通冷冻血浆',
          label: '普通冷冻血浆'
        },
        {
          value: '机器单采浓缩白细胞县液',
          label: '机器单采浓缩白细胞县液'
        },
        {
          value: '机器单采浓缩血小板',
          label: '机器单采浓缩血小板'
        },
        {
          value: '洗涤红细胞',
          label: '洗涤红细胞'
        },
        {
          value: '浓缩红细胞',
          label: '浓缩红细胞'
        },
        {
          value: '红细胞悬液',
          label: '红细胞悬液'
        },
        {
          value: '其他',
          label: '其他'
        },
      ],
      optionsBloodOther: [
        {
          value: '全血',
          label: '全血'
        },
        {
          value: '其他制剂',
          label: '其他制剂'
        },
        {
          value: '冷冻红细胞',
          label: '冷冻红细胞'
        },
        {
          value: '冷沉淀',
          label: '冷沉淀'
        },
        {
          value: '少白细胞红细胞',
          label: '少白细胞红细胞'
        },
        {
          value: '手工分离浓缩血小板',
          label: '手工分离浓缩血小板'
        },
        {
          value: '新鲜冰冻血浆',
          label: '新鲜冰冻血浆'
        },
        {
          value: '新鲜液体血浆',
          label: '新鲜液体血浆'
        },
        {
          value: '普通冷冻血浆',
          label: '普通冷冻血浆'
        },
        {
          value: '机器单采浓缩白细胞县液',
          label: '机器单采浓缩白细胞县液'
        },
        {
          value: '机器单采浓缩血小板',
          label: '机器单采浓缩血小板'
        },
        {
          value: '洗涤红细胞',
          label: '洗涤红细胞'
        },
        {
          value: '浓缩红细胞',
          label: '浓缩红细胞'
        },
        {
          value: '红细胞悬液',
          label: '红细胞悬液'
        },
        {
          value: '其他',
          label: '其他'
        },
      ],

      optionsAgeStage: [
        {
          value: '1',
          label: '1-6月'
        },
        {
          value: '2',
          label: '7-12月'
        },
        {
          value: '3',
          label: '1-6岁'
        },
        {
          value: '4',
          label: '7-12岁'
        },
        {
          value: '5',
          label: '13-18岁'
        },
        {
          value: '6',
          label: '19-64岁'
        },
        {
          value: '7',
          label: '65岁以上'
        },
        {
          value: '8',
          label: '其他'
        },
      ],
      optionsDepartment: [
        {
          value: '1',
          label: '信息科'
        },
        {
          value: '2',
          label: '外科'
        },
        {
          value: '3',
          label: '妇产科'
        },
        {
          value: '4',
          label: '儿科'
        },
        {
          value: '5',
          label: '麻醉科'
        }
      ],
      optionsSeverity: [
        {
          value: '1',
          label: 'A级：客观环境或条件可能引发不良事件（不良事件隐患）'
        },
        {
          value: '2',
          label: 'B级：不良事件发生但未累及患者'
        },
        {
          value: '3',
          label: 'C级：不良事件累及到患者但没有造成伤害'
        },
        {
          value: '4',
          label: 'D级：不良事件累及到患者需要进行检测以确保患者不被伤害，或需通过干预组织伤害发生'
        },
        {
          value: '5',
          label: 'E级：不良事件造成患者暂时性伤害并需要进行治疗或干预'
        },
        {
          value: '6',
          label: 'F级：不良事件造成患者暂时性伤害并需要住院或延长住院时间'
        },
        {
          value: '7',
          label: 'G级：不良事件造成患者永久性伤害，但不需要治疗挽救生命'
        },
        {
          value: '8',
          label: 'H级：不良事件发生并导致患者需要治疗挽救生命'
        },
        {
          value: '9',
          label: 'I级：不良事件发生导致患者死亡'
        },
      ],
      fileList: [],
      boxlist: [],
    }
  },
  // 禁止web端屏幕缩放
  created() {
    this.formEvent.heEventReport.id = this.$route.query.id;
    if(this.formEvent.heEventReport.id){
      getBasic(this.formEvent.heEventReport.id).then(response => {
        //获取后台传过来的表单
        this.formEvent = response.data;
        //将其对应赋值进行表单渲染
        this.basicForm=this.formEvent.heEventBasic
        this.reportForm=this.formEvent.heEventReport
        this.xian();
      });
    }


    // window.addEventListener("mousewheel", function (event) {
    //   if (event.ctrlKey === true || event.metaKey) {
    //     event.preventDefault();
    //   }
    // }, {passive: false})
  },
  methods: {
    xian() {
      //用于多选框反显
      this.checkList = this.pushCheckbox(this.basicForm.bedTreatmentConditions)
      this.yuanyin = this.pushCheckbox(this.basicForm.fallCauses)
      this.chuli = this.pushCheckbox(this.basicForm.fallDisposal)
      this.dimian = this.pushCheckbox(this.basicForm.fallGroundConditions)
    },
    //用于多选框反显
    pushCheckbox(str) {
      if (str == null) {
        console.log("多选框未全选中")
      } else {
        const boxlist = str.split(',');
        return boxlist;
      }
    },
    //el 标签  speed 滚动速率 此处是50px 值越大滚动的越快
    goAssignBlock(el, speed) {
      let t = this.$refs[el].offsetTop - 100

      function scrollToTop() {
        let scrollTop = window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop;
        if (scrollTop > t) {
          window.scrollTo(0, scrollTop - speed);
          // 使用 requestAnimationFrame 进行平滑滚动
          requestId = window.requestAnimationFrame(scrollToTop);
        } else {
          window.scrollTo(0, t);
          // 取消动画帧的请求
          window.cancelAnimationFrame(requestId);
        }
      }

      let requestId = window.requestAnimationFrame(scrollToTop);
    },
    zhengzhuang(boxlist) {
      this.basicForm.transfusionBloodMainSymptoms = this.popCheckbox(boxlist)
      // if (!this.basicForm.transfusionBloodMainSymptoms.length) {
      // 手动验证该字段
      this.$refs.basicForm.validateField('transfusionBloodMainSymptoms');
      // }
    },
    huanzhe1(boxlist) {
      this.basicForm.transfusionPatientType = this.popCheckbox(boxlist)

      this.$refs.basicForm.validateField('transfusionPatientType');
    },
    huanzhe2(boxlist) {
      this.basicForm.transfusionMainType = this.popCheckbox(boxlist)

      this.$refs.basicForm.validateField('transfusionMainType');
    },
    huanzhe3(boxlist) {
      this.basicForm.transfusionOtherType = this.popCheckbox(boxlist)

      this.$refs.basicForm.validateField('transfusionOtherType');
    },


    //这个是由于有的是多选框有的是单选但是我们后台只能接字符串而不是数组所以需要分割下面会调用
    popCheckbox(boxlist) {
      let str = '';
      for (let i = 0; i < boxlist.length; i++) {
        if (i == 0) {
          str = boxlist[i];
        } else {
          str = str + ',' + boxlist[i];
        }
      }
      return str;
    },


    //保存按钮事件
    baocun() {
      this.$refs["basicForm"].validate(valid => {
        if (valid) {
          this.$refs["reportForm1"].validate(valid => {
            if (valid) {
              this.$refs["reportForm2"].validate(valid => {
                if (valid) {
                  this.$refs["reportForm3"].validate(valid => {
                    if (valid) {
                      this.$refs["reportForm4"].validate(valid => {
                        if (valid) {
                          this.$refs["reportForm5"].validate(valid => {
                            if (valid) {
                              this.$refs["reportForm6"].validate(valid => {
                                if (valid) {
                                  // 将时间转换为 "yyyy-MM-dd HH:mm:ss" 格式
                                  if (this.basicForm.transfusionBloodStartTime !== null) {
                                    this.basicForm.transfusionBloodStartTime= this.basicForm.transfusionBloodStartTime.toLocaleString('zh-CN', {timeZone: 'Asia/Shanghai',hour12: false})
                                    this.basicForm.transfusionBloodStartTime= this.basicForm.transfusionBloodStartTime.replace(/\//g, '-')
                                  }
                                  if (this.basicForm.transfusionBloodEndTime !== null) {
                                    this.basicForm.transfusionBloodEndTime= this.basicForm.transfusionBloodEndTime.toLocaleString('zh-CN', {timeZone: 'Asia/Shanghai',hour12: false})
                                    this.basicForm.transfusionBloodEndTime= this.basicForm.transfusionBloodEndTime.replace(/\//g, '-')
                                  }
                                  if (this.reportForm.patientAdmissionTime !== null) {
                                    this.reportForm.patientAdmissionTime = this.reportForm.patientAdmissionTime.toLocaleString('zh-CN', {timeZone: 'Asia/Shanghai',hour12: false})
                                    this.reportForm.patientAdmissionTime = this.reportForm.patientAdmissionTime.replace(/\//g, '-')
                                  }
                                  if (this.reportForm.occurrenceTime !== null) {
                                    this.reportForm.occurrenceTime = this.reportForm.occurrenceTime.toLocaleString('zh-CN', {timeZone: 'Asia/Shanghai',hour12: false})
                                    this.reportForm.occurrenceTime = this.reportForm.occurrenceTime.replace(/\//g, '-')
                                  }
                                  if (this.reportForm.patientDateOfBirth !== null) {
                                    this.reportForm.patientDateOfBirth = this.reportForm.patientDateOfBirth.toLocaleString('zh-CN', {timeZone: 'Asia/Shanghai',hour12: false})
                                    this.reportForm.patientDateOfBirth = this.reportForm.patientDateOfBirth.replace(/\//g, '-')
                                  }
                                  if (this.reportForm.occurrenceDate !== null) {
                                    this.reportForm.occurrenceDate = this.reportForm.occurrenceDate.toLocaleString('zh-CN', {timeZone: 'Asia/Shanghai',hour12: false})
                                    this.reportForm.occurrenceDate = this.reportForm.occurrenceDate.replace(/\//g, '-')
                                  }
                                  this.reportForm.note1 = "输血不良事件"
                                  //将代表事件上报信息表的字段内容赋值给heEventReport对象用于连接后台
                                  this.formEvent.heEventReport = this.reportForm
                                  //将代表事件基本信息表的字段内容赋值给heEventReport对象用于连接后台
                                  this.formEvent.heEventBasic = this.basicForm
                                  //将代表事件基本信息表的字段内容赋值给heEventReport对象用于连接后台
                                  this.formEvent.heEventFlow = this.flowForm
                                  if (this.formEvent.heEventReport.id != null) {
                                    updateBasic(this.formEvent).then(response => {
                                      this.$modal.msgSuccess("修改成功");
                                      this.$router.push({path: "/hosipitalevent/caogaoshijian"});
                                    });
                                  } else {
                                    //否则执行新增
                                    addBasic(this.formEvent).then(response => {
                                      this.$modal.msgSuccess("事件创建成功，请进入并呈送事件！");
                                      // this.$router.push({path: "/index"});
                                      this.$router.push({path: "/hosipitalevent/caogaoshijian"});//跳转到呈送页面
                                    });
                                  }
                                }
                              })
                            }
                          })
                        }
                      })
                    }
                  })
                }
              })
            }
          })
        }
      })
    },
    //返回按钮
    fanhui() {
      if (this.formEvent.heEventReport.id != null) {
        this.$router.push({path: "/hosipitalevent/caogaoshijian"});
      } else {
        this.$router.push({path: "/hosipitalevent/report"});
      }
    },
    handleChange(val) {
      console.log(val);
    },
    handleRemove(file, fileList) {
      console.log(file, fileList);
    },
    handlePictureCardPreview1(file) {
      this.dialogImageUrl1 = file.url;
      this.dialogVisible1 = true;
    },
    handlePictureCardPreview2(file) {
      this.dialogImageUrl2 = file.url;
      this.dialogVisible2 = true;
    }
  },

}

</script>

<style lang="scss" scoped>
@import "src/views/module/shao/blackFont";
.sidebar {
  margin-left: 3%;
  width: 10%;
  float: left;
  display: flex;
}

.content {
  margin-left: 3%;
  margin-right: 1.5%;
  width: 87%;
  float: right;
}

.btn-box {
  position: fixed;
  margin-top: 1%;

  ::v-deep .el-card__body {
    padding: 15px 15px 15px 5px;
  }
}

.btn-box button {
  text-align: left;
  padding: 0 0 0 10px;
  display: block;
  width: 150px;
  height: 40px;
  border: none;
  cursor: pointer;
}

.btn-box button:hover {
  background: hsl(221, 98%, 68%);
  color: white;
}

.block {
  border: 1px solid white;
  width: 100%;
  height: 100%;
  display: flex;
  font-size: 5rem;
  box-sizing: border-box;

  .el-form-item {
    margin-bottom: 10px;
  }
}

.bname {
  font-family: Helvetica Neue, Helvetica, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Arial, sans-serif;
  font-weight: bold;
  font-size: 20px;
  color: black;
}

.shijianbname {
  font-family: Helvetica Neue, Helvetica, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Arial, sans-serif;
  font-weight: bold;
  font-size: 20px;
  color: black;
}
</style>
